import Vue from 'vue'
import VueRouter from 'vue-router'

import UnFIND from "../views/404.vue"
import adminBase from "@/views/admin/AdminBaseView.vue";
import courseInfoManage from "@/views/admin/course/CourseInfoManage.vue";
import teacherInfoAuditing from "@/views/admin/teacher/TeacherInfoAuditing.vue";
import teacherInfoManage from "@/views/admin/teacher/TeacherInfoManage.vue";
import studentInfoAuditing from "@/views/admin/student/StudentInfoAuditing.vue";
import studentInfoManage from "@/views/admin/student/StudentInfoManage.vue";
import StudentSelectRecord from "@/views/admin/student/StudentSelectRecord.vue";
import courseSelectManage from "@/views/admin/course/CourseSelectManage.vue";
import courseCommentStatic from "@/views/admin/statistic/courseCommentStatistic.vue"
import courseSelectStatistic from "@/views/admin/statistic/courseSelectStatistic.vue"
import HomeBase from '@/views/home/HomeBaseView.vue'
import loginAndRegister from "@/views/home/loginAndRegister.vue"
import studentSelectCourse from "@/views/home/student/studentSelectCourse.vue";
import studentCourse from "@/views/home/student/studentCourse.vue";
import studentCourseComment from "@/views/home/student/studentCourseComment.vue";
import teacherCourseComment from "@/views/home/teacher/teacherCourseComment.vue"
import teacherCourseManage from "@/views/home/teacher/teacherCourseManage.vue"

Vue.use(VueRouter)


const routes = [
  //老师和学生主界面路由
  {
    path: '/',
    component: HomeBase,
    children: [
      {
        path: '/',
        name: 'login',
        component: loginAndRegister// 登录注册界面
      },
      {
        path : 'course',
        name: 'course',
        meta: {
          atRole: 1, // 表示进入这个路由需要的角色身份
        },
        component: studentCourse// 查看课程页面
      },
      {
        path: 'course-comment',
        name: 'courseComment',
        meta: {
          atRole: 1, // 表示进入这个路由需要的角色身份
        },
        component: studentCourseComment// 查看课程评价页面
      },
      {
        path: 'course-select',
        name: 'courseSelect',
        meta: {
          atRole: 1, // 表示进入这个路由需要的角色身份
        },
        component: studentSelectCourse // 选课中心
      },
      {
        path: 'course-comment-teacher',
        name: 'courseCommentTeacher',
        meta: {
          atRole: 2, // 表示进入这个路由需要的角色身份
        },
        component: teacherCourseComment // 老师查看课程评价界面
      },
      {
        path: 'course-manage-teacher',
        name: 'courseManageTeacher',
        meta: {
          atRole: 2, // 表示进入这个路由需要的角色身份
        },
        component: teacherCourseManage // l老师课程管理
      }
    ]
  },
  //教务人员界面路由
  {
    path: '/admin',
    component: adminBase,
    meta: {
      atRole: 3, // 表示进入这个路由需要的角色身份
    },
    children: [
      {
        path: '/',
        name: "adminHome", // 首页
        component: courseInfoManage
      },
      {
        path: 'teachers-auditing',
        name: "teachersAuditing", // 教师注册审核
        component: teacherInfoAuditing
      },
      {
        path: 'teachers-info',
        name: "teachersInfo", // 教师信息管理
        component: teacherInfoManage
      },
      {
        path: 'students-auditing',
        name: "studentsAuditing", // 学生注册审核
        component: studentInfoAuditing
      },
      {
        path: 'students-info',
        name: "studentsInfo", // 学生信息管理
        component: studentInfoManage
      },
      {
        path: 'students-course-record',
        name: "studentsCourseRecord", // 学生选课记录
        component: StudentSelectRecord
      },
      {
        path: 'courses-info',
        name: "coursesInfo", // 课程信息管理
        component: courseInfoManage
      },

      {
        path: 'students-courses-mange',
        name: "studentsCoursesMange", // 学生选课管理
        component: courseSelectManage
      },
      {
        path: 'courses-comment-statistics',
        name: "coursesCommentStatistics", // 课程评价统计
        component: courseCommentStatic
      },
      {
        path: 'courses-select-report',
        name: "coursesSelectReport", // 选课报告
        component: courseSelectStatistic
      }
    ]
  },
  //404路由配置
  {
    path: '/404',
    component: UnFIND
  },
  {
    path: '*',
    redirect: '/404',
  }
]

const router = new VueRouter({
  //指定路由使用 HTML5 History 模式，这样 URL 就不会带上 # 符号。
  mode: "history",
  //定义的路由数组，包含了应用程序的各个路由配置。
  routes: routes,
  //定义了页面切换时的滚动行为，将页面滚动到顶部。
  scrollBehavior(to, from, savedPosition) {
    return {x: 0, y: 0}
  }
})

router.beforeEach((to, from, next) => {//用于注册一个全局前置守卫，它会在路由切换开始之前被调用。
  //to 表示即将要进入的路由对象，from 表示即将要离开的路由对象，next 是一个函数，调用它来进入下一个钩子。
  // 检查即将进入的路由是否需要特定角色权限
  const requiresRole = to.matched.some(record => record.meta.atRole);
  // 从localStorage中获取当前用户的角色
  const currentRole = localStorage.getItem("role");
  if (requiresRole) {
    // 如果路由需要特定角色权限
    // 检查用户角色是否符合要求
    // 注意：从localStorage获取的值是字符串类型，如果atRole是数字，需要确保类型一致
    if (to.matched.some(record => Number(currentRole) === record.meta.atRole)) {
      // 如果用户角色符合要求，允许路由继续
      next();
    } else {
      // 如果用户角色不符合要求，重定向到登录页面
      next({
        //重定向到 login，同时通过 query 参数将原始的目标路径记录下来，以便登录后跳回原来想要访问的页面。
        path: '/',
        query: {redirect: to.fullPath} // 将用户原本想要访问的页面路径作为参数传递，便于登录后跳转
      });
    }
  } else {
    // 如果路由不需要特定角色权限，直接允许路由继续
    next();
  }
});

export default router
